
// const Ml = {
//   Button() {
//     return (<button>登录</button>)
//   },
//   Form() {
//     return (<div>Form</div>)
//   }
// }

// let { Button, Form } = Ml;

// function DemoA() {
//   return (
//     <div>
//       {/* <Ml.Button></Ml.Button>
//       <Ml.Form></Ml.Form> */}

//       <Button></Button>
//       <Form></Form>
//     </div>
//   )
// }

// export default DemoA;

// ---------------------------------

// function Child(props) {
//   let { name, age, address, ...other } = props;
//   console.log("other:", other);
//   return (
//     <div>
//       我是child组件
//       <p>{name}  {age} {address}</p>
//     </div>
//   )
// }

// function DemoA() {
//   let data = {
//     name: "wc",
//     age: 18,
//     address: "bj",
//     list: ["a", "b", "c"],
//     info: { a: "1", b: "2" },
//     fn: () => { console.log("fn..."); },
//     header: (<header>我是头部</header>),
//     id: Symbol(1)
//   }
//   return (
//     <div>
//       <h2>DemoA组件</h2>
//       <hr />
//       <Child name={data.name} age={data.age} address={data.address}></Child>
//       <hr />
//       <Child {...data}></Child>
//       <hr />
//     </div>
//   )
// }

// export default DemoA;



// // ---------------------------------


// function Child(props) {
//   console.log("props:", props);
//   // children可以是多种类型
//   let { children } = props;
//   let res = null;
//   if (typeof children == "function") {
//     res = children();
//   } else {
//     res = children;
//   }
//   return (
//     <div>
//       我是child组件
//       <p>{res}</p>
//     </div>
//   )
// }

// function DemoA() {
//   return (
//     <div>
//       <hr />
//       <Child>你好，我是React~</Child>
//       <hr />
//       <Child><div>我是一个div</div></Child>
//       <hr />
//       <Child>{() => { return 110 }}</Child>
//       <hr />
//       <Child>{() => { return (<strong>888</strong>) }}</Child>
//       <hr />
//       <Child>{() => (<strong>888</strong>)}</Child>
//       <hr />
//     </div>
//   )
// }

// export default DemoA;

// ---------------------------------

function DemoA() {
  return (
    <div>
      <div>{["a", "b", "c", true, null, undefined, 110]}</div>
    </div>
  )
}

export default DemoA;